<template>
	<view class="haibaofenx">
		<view class="" style="height: 313rpx;width: 750rpx;">

		</view>
		<view class="touxiang">
			<image class="img" :src="jianglijine.avatarUrl" mode=""></image>
		</view>
		
		<view class="xingming">
			{{jianglijine.nickname}} {{jianglijine.phone}}送你一分抢购商品
		</view>
		<view class="tupian">
			<view class="shangpin" v-for="item in shangpin">
				<image class="img" :src="item.img" mode=""></image>
				<view class="shishu">
					0.01
					<text style="font-size: 20rpx;">元</text>
				</view>
			</view>
		

		</view>
		<view class="jianjie">
			实际商品可能因城市不同而有所差异
		</view>
		<view class="erweima">
			<!-- <tki-qrcode  style="margin-top: 8rpx;" ref="qrcode" :val="yaiqingma" :size="390" unit="upx" background="#000000"
			 foreground="#ffffff" pdground="#ffffff" :onval="true" :loadMake="true" :usingComponents="true" :showLoading="true"
			 loadingText="生成中" /> -->
			 <image class="imga" :src="erweimaimg" mode=""></image>
		</view>
		<view class="qinggou">
			微信扫一扫，查看抢购商品
		</view>
	</view>
</template>
<script>
	import {
		mapState
	} from 'vuex';
	// import tkiQrcode from "@/components/tki-qrcode/tki-qrcode.vue"
	export default {
		components: {
			// tkiQrcode
		},
		data() {
			return {
				yaiqingma: "",
				jianglijine:{
					avatarUrl:'',
				},
				shangpin:[],
				erweimaimg:'',
				userInfotz:{}
			}
		},
		onShow() {
			this.userInfotz = uni.getStorageSync('userInfo')
			console.log('this.userInfotz',this.userInfotz)
			this.getyonghu()
			this.chauxn()
			this.getShangpin()
			this.geterweimatp()//获取二维码图片


		},
		// onShareAppMessage() {
		// 	return {
		// 		title: '百万放送，一分抢购',
		// 		// imageUrl: this.goods.img,
		// 		path: '/pages/user/haibaofenx?userId=' + this.userInfotz.id
		// 	};
		// },
		onLoad() {

		},

		computed: {
			...mapState(['hasLogin', 'userInfo'])
		},
		methods: {
			//获取商品
			getShangpin(){
				var obj = {}
				obj.activityType = 2
				obj.storageId =this.$store.state.storageId
				var that = this
				that.$api.request('activity', 'showGoodsList', obj, failres => {
					that.$api.msg(failres.errmsg)
					uni.hideLoading()
				}).then(res => {
					if (res.errno == '200') {
						if (res.data) {
							that.shangpin = res.data
							console.log('that.shangpin',that.shangpin)
							
						}
				
				
					}
				})
			},
			chauxn() {
				var obj = {}
				obj.userId = this.userInfotz.id
				var that = this
				that.$api.request('user', 'getUserInfo', obj, failres => {
					that.$api.msg(failres.errmsg)
					uni.hideLoading()
				}).then(res => {
					if (res.errno == '200') {
						if (res.data) {
							that.jianglijine = res.data
							this.jianglijine.phone = this.jianglijine.phone.substr(0, 3) + "****" + this.jianglijine.phone.substr(7);
							console.log('that.jianglijine',that.jianglijine)
						}


					}
				})

			},
			//获取图片
			geterweimatp(){
				var obj = {}
				obj.userId = this.userInfotz.id
				var that = this
				that.$api.request('user', 'inviteCodeQRImg', obj, failres => {
					that.$api.msg(failres.errmsg)
					uni.hideLoading()
				}).then(res => {
					if (res.errno == '200') {
						if (res.data) {
							that.erweimaimg = res.data
							// that.$api.msg(that.erweimaimg)
							console.log('this.erweimaimg',this.erweimaimg)
							
						}
				
				
					}
				})
			},
			
			//获取用户邀请码
			getyonghu(){
				var obj = {}
				obj.userId = this.userInfotz.id
				var that = this
				that.$api.request('user', 'inviteCode', obj, failres => {
					that.$api.msg(failres.errmsg)
					uni.hideLoading()
				}).then(res => {
					if (res.errno == '200') {
						if (res.data) {
							
							console.log('获取用户邀请码',res.data)
							that.yaiqingma = "https://api.lailemefresh.com"
						}
				
				
					}
				})
			}

		}
	}
</script>
<style lang='scss' scoped>
	.haibaofenx {
		width: 750rpx;
		height: 1466rpx;
		background-image: url(https://laileme123.oss-cn-shanghai.aliyuncs.com/imgs/8738d6342f68fcc2a994d5df85375b4.png);
		background-size: 100% 100%;

		.qinggou {
			text-align: center;
			font-size: 28rpx;
			font-family: Source Han Serif CN;
			font-weight: 400;
			color: #666666;
			line-height: 0px;
			margin-top: 20rpx;
		}

		.erweima {
			width: 400rpx;
			height: 400rpx;
			margin: auto;
			margin-top: 41rpx;
			.imga {
				width: 392rpx;
				height: 392rpx;
			}
		}

		.jianjie {
			margin-top: 32rpx;
			text-align: center;
			font-size: 24rpx;
			font-family: Source Han Sans CN;
			font-weight: 400;
			color: #666666;
			line-height: 0px;
		}

		.tupian {
			width: 750rpx;
			height: 220rpx;
			margin-top: 131rpx;
			display: flex;
			align-items: center;
			justify-content: space-around;
			padding-left: 46rpx;
			padding-right: 46rpx;

			.shangpin {
				width: 160rpx;
				height: 220rpx;
				background: #5EC32A;
				border-radius: 10rpx;

				.shishu {
					margin-top: 14rpx;
					text-align: center;
					font-size: 43rpx;
					font-family: Source Han Serif CN;
					font-weight: 800;
					font-style: italic;
					color: #FEFEFE;
					line-height: 0px;
				}

				.img {
					width: 144rpx;
					height: 144rpx;
					border-radius: 6rpx 10rpx 10rpx 10rpx;
					margin: 8rpx;
				}
			}
		}

		.xingming {
			margin-top: 20rpx;
			text-align: center;
			font-size: 28rpx;
			font-family: Source Han Sans CN;
			font-weight: 400;
			color: #333333;
		}

		.touxiang {
			width: 140rpx;
			height: 140rpx;
			margin: auto;
			border-radius: 50%;
			background-color: #FFFFFF;
			.img {
				width: 140rpx;
				height: 140rpx;
				border-radius: 50%;
			}
		}
	}
</style>
